<template>
  <div class="ind-post-form-share">
    <span class="field-label">{{ shareInfo.title }}</span>
    <!-- <el-radio-group v-model="shareCount" :disabled="disabled" @change="onFromShareChange">
      <el-radio :label="1">是</el-radio>
      <el-radio :label="0">否</el-radio>
    </el-radio-group> -->
    <el-radio-group v-if="!shareMax" v-model="shareCount" :disabled="disabled" @change="onFromShareChange">
      <el-radio :label="1">是</el-radio>
      <el-radio :label="0">否</el-radio>
    </el-radio-group>
    <el-radio-group v-else v-model="shareCount" :disabled="disabled" @change="onFromShareChange">
      <el-radio :label="0">0 项</el-radio>
      <el-radio v-for="idx in shareMax" :key="idx" :label="idx">{{ idx }} 项</el-radio>
    </el-radio-group>
  </div>
</template>

<script>
export default {
  name: 'PostFormShare',
  components: {},
  props: {
    shareInfo: {
      type: Object,
    },
    disabled: {
      type: Boolean,
    },
  },
  data() {
    return {
      shareCount: 0,
    }
  },
  computed: {
    shareMax() {
      if (this.shareInfo) {
        return Number(this.shareInfo.config.shareMax || 0)
      }
      return 0
    },
  },
  watch: {
    shareInfo(val) {
      if (val.value) {
        this.shareCount = val.value
      } else {
        this.shareCount = 0
      }
    },
  },
  created() {
    if (this.shareInfo) {
      this.shareCount = this.shareInfo.value || 0
    }
  },
  mounted() {},
  methods: {
    onFromShareChange() {
      this.$emit('share-count-change', this.shareCount)
    },
  },
}
</script>
<style lang="scss" scoped>
.ind-post-form-share {
  padding-right: 10px;
  .field-label {
    font-size: 16px;
    color: #606266;
    font-weight: bold;
    margin-right: 40px;
    line-height: 2;
  }
}
</style>
